<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<!-- 引入easyui 的主题样式  和  easyui 提供的图标样式 -->
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css" />
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/themes/icon.css" />
<!-- 引入jquery 和  easyui.js   中文设置js-->
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.9.1.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
	$(function(){
		$('#dg').datagrid({  
		    url:'leaves', //获取员工请假信息   
		    columns:[[//hidden:true 
		        //{field:'id',title:'请假号',width:100}, 
		        {field:'eid',title:'员工id',width:100}, 
		        {field:'ename',title:'姓名',width:100}, 
		        {field:'dname',title:'部门',width:100}, 
		        {field:'edata',title:'申请日期',width:100}, 
		        {field:'etartday',title:'请假开始日期',width:100}, 
		        {field:'actualday',title:'请假天数',width:100}, 
		        {field:'category',title:'请假类别',width:100}, 
		        {field:'reason',title:'请假理由',width:100},
		        {field:'state',title:'审批状态',width:100},
		      	{field:'opertion',title:'操作',width:100,
		        	formatter: function(value,row,index){
							var val= "<a href='#' onclick='showDetail("+row.id+")'>查看</a>";
							return val;
						}		      	
		      	}
		    	]],
		  //只允许选择一行。
		  	singleSelect:true,
		    autoRowHeight:true,
		    striped:true,
		    rownumbers:true,
		    //如果为true，则在DataGrid控件底部显示分页工具栏。
		    pagination:true,
		    //pageSize:5,
		  	//pageList:[5,10,15],
		    pagePosition:'bottom',
		    //toolbars
		    toolbar: [{
		    	text:'待审核',
				iconCls: 'icon-edit',
				handler: function(){
					$('#dg').datagrid('load', {    
					    state: '待审核',    
					});
				}
			},'--',{
				text:'已审核',
				iconCls: 'icon-edit',
				handler: function(){
					$('#dg').datagrid('load', {    
					    state: '已审核',    
					});
				}
			},'--',{
				text:'统计',
				iconCls: 'icon-edit',
				handler: function(){
					$('#dg').datagrid('load', {    
					    state: '',    
					});
				}
			}]
		});
		//查看申请单窗口
		$('#win').window({
			title:' ',
		    width:600,    
		    height:450,    
		    modal:true,
		    closed:true,
		    collapsible:false
		});		
	})
	//查看请假订单按钮
	function showDetail(id){
			var id=id;
			$.ajax({
				url:'applyList',
				type:'post',
				data:{'id':id},
				dataType:'json',
				success:function(data){
					var dat=data;//eval("("+data+")");
					$('#win').window('open');
					$('#ename').textbox('setText',dat.applyVacation.ename);
					$('#id').textbox('setText',id);
					$('#eid').textbox('setText',dat.applyVacation.eid);
					$("#dname").textbox('setText',dat.applyVacation.dname);
					$("#edata").textbox('setText',dat.applyVacation.edata);
					$("#etartday").textbox("setText",dat.applyVacation.etartday);
					$("#actualday").textbox("setText",dat.applyVacation.actualday);
					$("#category").textbox("setText",dat.applyVacation.category);
					$("#reason").textbox("setText",dat.applyVacation.reason);
					$("#state").textbox("setText",dat.applyVacation.state);
					$("#retime").textbox("setText",dat.applyVacation.retime);
					$("#remake").val(dat.applyVacation.remake);//textarea
					var state=dat.applyVacation.state;
					}			 			
			})
			//配置提交按钮
			$('#save').bind('click', function(){
				$('#ff').form('submit', {    
				    url:'vacation',    
				    onSubmit: function(param){
				        param.id = id;     
				    },  
				    success:function(data){    
				        if(data=='true'){
				        	$.messager.alert('提示','提交成功');
				        	$('#ff').form('clear');
				        	$('#win').window('close');
				        }else{
				        	$.messager.alert('提示','提交失败');
				        }	        
				        $('#dg').datagrid('reload'); 
				    }    
				});    
		    });
			//配置取消按钮
			$('#cancle').bind('click', function(){    
				 $('#win').window('close');
		    }); 
			//配置审核时间校验
			$.extend($.fn.validatebox.defaults.rules, {
				date : {
	                validator : function(value) {              
	        		//格式yyyy-MM-dd或yyyy-M-d
	                    return /^(?:(?!0000)[0-9]{4}([-]?)(?:(?:0?[1-9]|1[0-2])\1(?:0?[1-9]|1[0-9]|2[0-8])|(?:0?[13-9]|1[0-2])\1(?:29|30)|(?:0?[13578]|1[02])\1(?:31))|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)([-]?)0?2\2(?:29))$/i.test(value); 
	                },
	                message : '清输入合适的日期格式'
	            },
			});
		}
</script>
<body>
	<!-- 查看员工请假页面 -->
	<table id="dg"></table>
	<div id="win">
	<form id="ff" method="post">   
		<div><h2 align="center">请假申请单</h2></div>
		<div style='margin-left: 33px'>		
			申请人:<input id='ename'  class="easyui-textbox" type="text" data-options="readonly:true"/>
			&nbsp
			申请日期:<input id='edata'  class="easyui-textbox" type="text" data-options="readonly:true"/>			
		</div>
		<div style='margin-left: 45px;margin-top: 5px'>
			部门:<input id='dname'  class="easyui-textbox" type="text" data-options="readonly:true"/>
			&nbsp&nbsp&nbsp&nbsp&nbsp
			员工id:<input id='eid'  class="easyui-textbox" type="text" data-options="readonly:true"/>
		</div>
		<div style='margin-top: 5px'>
			请假开始日期:<input id='etartday'  class="easyui-textbox" type="text" data-options="readonly:true"/>
			&nbsp请假天数:<input id='actualday'  class="easyui-textbox" type="text" data-options="readonly:true"/>
		</div>
		<div style='margin-left: 25px;margin-top: 5px'>
			请假类别:<input id='category'  class="easyui-textbox" type="text" data-options="readonly:true"/>
		</div>
		<div style='margin-left: 25px;margin-top: 5px'>
			请假原因:<input id='reason' class="easyui-textbox" type="text" data-options="readonly:true"/>
		</div>
		<div style='margin-left: 25px;margin-top: 5px'>
			审批状态:<input id='state' class="easyui-textbox" type="text" data-options="readonly:true"/>
		</div>
		<hr/>
		<br>
		<div style='margin-left: 25px;margin-top: 5px'>
			审核意见:<select id="opinion" name="opinion" value='请选择' class="easyui-combobox" style="width:150px;" data-options="editable:false,panelHeight:'auto'" >   
			    <option>同意</option>   
			    <option>不同意</option>      
			</select>
			审核时间:<input id="retime" name='retime' type="text" class="easyui-datebox" data-options="required:true,validType:'date'"></input>  
		</div>
		<div style='margin-left: 28px'>
			备注:<br>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
			<textarea id='remake' name='remake' rows="4" cols="55" data-options="readonly:true"></textarea>
		</div>
		<br>
		<div style='margin-left: 200px'>
			<a id="save" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">提交</a>
			&nbsp&nbsp&nbsp&nbsp&nbsp 
			<a id="cancle" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'">取消</a> 
		</div>						
    </form>
	</div>    
</body>
</html>